/**
 * useReducer
 *    语法：
 *      const [state, dispatch] = useReducer(reducer, initState)
 *        1. initState - 初始话 state 数据
 *        2. reducer - 是个函数，接收到两个参数（state, action)
 *              1. 该函数，在我们调用 dispatch 时触发，接受的两个参数
 *                    state - 表示上一次的 state 数据
 *                    action - 表示动作，也就是 dispatch 调用时传递过来的内容
 *                 该函数，需要返回一份全新的state数据，返回的state数据，会给到 state 状态数据
 *              function reducer(state, action) {
 *
 *              }
 *        3. state  - 状态数据
 *              1. 默认是由 initState 决定
 *              2. 后续是由 reducer 的返回值决定
 *        4. dispatch - 派发动作的函数
 *              dispatch(action)
 *              action - 是个动作，是一个包含有 type 属性的一个对象。
 *              调用该 dispatch 会触发 reducer 函数
 *
 *    reducer
 *      该函数需要是一个纯函数（不能由副作用）
 *
 *    纯函数的概念
 *      1. 相同的输入一定会产生相同的输出
 *      2. 不能对参数有修改
 *
 */

// 纯函数
function fn1() {
  return "hello";
}

// 纯函数
function fn2(a, b) {
  return a + b;
}
fn2(1, 2); // 3
fn2(1, 2); // 3

// 纯函数
function fn3(state) {
  return state;
}

// 非纯函数，对参数有修改
function fn4(state) {
  state.id = "111";
  return state;
}

// 非纯函数，不能确保 root 这个元素一定存在
function fn5(state) {
  return document.getElementById("root");
}

// 非纯函数，不能确保接口的返回值一致。
function fn6() {
  return fetch("接口url");
}

// 非纯函数，有异步操作
function fn7() {
  setTimeout(() => {
    return "hello";
  }, 1000);
}
